import React, { createContext, useReducer } from 'react';
export const ColorContext = createContext({});
export const UPDATE_COLOR = "UPDATE_COLOR";

const reducer = (state, action) => {
    console.log("reducer");
    console.log(state);
    console.log(action);
    switch (action.type) {
        case UPDATE_COLOR:
            return action.color
        default:
            return state
    }
}

export const Color = props => {
    const [color, dispatch] = useReducer(reducer, 'blue');

    return (
        <ColorContext.Provider value={{ color, dispatch }}>
            {props.children}
        </ColorContext.Provider>
    );
}